import { createBrowserRouter } from 'react-router-dom';
import { Suspense } from 'react';

import Layout from '@/pages/layouts/index';
import Login from '@/pages/login';
import Loading from '@/pages/loading';
import AuthRoute from '@/components/AuthRoute';
import NotFound from '@/pages/notFound';
import {
  Editor,
  ManageHome,
  ManageArticle,
  ManageTag,
  ManageType,
  ManageSystem,
  ManageSystemInfo,
  ManageSystemLog,
  ManageUser,
} from './modules';

const router = createBrowserRouter([
  {
    path: '/',
    element: (
      <AuthRoute>
        <Layout />
      </AuthRoute>
    ),
    children: [
      {
        path: '/',
        element: <ManageHome />,
      },
      {
        path: 'article',
        element: <ManageArticle />,
      },
      {
        path: 'tag',
        element: <ManageTag />,
      },
      {
        path: 'type',
        element: <ManageType />,
      },
      {
        path: 'system',
        element: <ManageSystem />,
        children: [
          {
            path: 'info',
            element: <ManageSystemInfo />,
          },
          {
            path: 'logs',
            element: <ManageSystemLog />,
          },
        ],
      },
      {
        path: 'user',
        element: <ManageUser />,
      },
    ],
  },
  {
    path: '/login',
    element: <Login />,
  },
  {
    path: '/editor',
    element: (
      <Suspense fallback={<Loading />}>
        <AuthRoute>
          <Editor />
        </AuthRoute>
      </Suspense>
    ),
  },
  {
    path: '*',
    element: <NotFound />,
  },
]);

export default router;
